<template>
<!--新建项目弹窗-->
  <div>
      <el-dialog title="新建项目" :visible.sync="dialogFisible" :before-close="cancelClick" >
        <el-form>
          <el-form-item label="项目名" :label-width="formLabelWidth" ref="getpName">
            <el-input v-model="pName" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="项目总负责人" :label-width="formLabelWidth">
            <el-select v-model="pPerson" placeholder="请选择总负责人" ref="getpPerson">
              <el-option label="经理A" value="A"></el-option>
              <el-option label="经理B" value="B"></el-option>
              <el-option label="经理C" value="C"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="功能模块分配" :label-width="formLabelWidth">
            <el-select v-model="mAllocation" placeholder="请选择功能模块" ref="getmAlloca">
              <el-option label="模块A" value="A"></el-option>
              <el-option label="模块B" value="B"></el-option>
              <el-option label="模块C" value="C"></el-option>
              <el-option label="模块D" value="D"></el-option>
              <el-option label="模块E" value="E"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="功能模块负责人" :label-width="formLabelWidth">
            <el-select v-model="mPerson" placeholder="请选择负责人" ref="getmPerson">
              <el-option label="职员A" value="A"></el-option>
              <el-option label="职员B" value="B"></el-option>
              <el-option label="职员C" value="C"></el-option>
              <el-option label="职员D" value="D"></el-option>
              <el-option label="职员E" value="E"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="项目状态" :label-width="formLabelWidth">
            <el-select v-model="pState" placeholder="请选择状态" ref="getpState">
              <el-option label="已关闭" value="A"></el-option>
              <el-option label="开发中" value="B"></el-option>
              <el-option label="维护中" value="C"></el-option>
              <el-option label="上线" value="D"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="模块地址" :label-width="formLabelWidth" ref="getdz">
            <el-input v-model="dz" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item  :label-width="formLabelWidth" >
            <el-button @click="getmkdz">获取地址</el-button>
          </el-form-item>
          <!-- <el-form-item label="项目权限" :label-width="formLabelWidth">
            <el-select v-model="pAuthority" placeholder="请选择项目权限" ref="pAuthority">
              <el-option label="已授权" value="y"></el-option>
              <el-option label="未授权" value="n"></el-option>
            </el-select>
          </el-form-item> -->
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="cancelClick">取 消</el-button>
          <el-button type="primary" @click="confirmClick">确 定</el-button>
        </div>
      </el-dialog>
    </div>
    <!-- <msg-show caption="提示" :msg="msgText" :show="showMessage" @close="showMessage=false"></msg-show> -->
 
</template>

<script>
// import msgShowVue from './msgShow.vue'
export default {
  name: 'ProjectBox',
  props:{
    caption:{},
    value:{},
    // show:{},
    dialogFormVisible: {
      type: Boolean,
      default: false
    },
  },
  inject: ["fatherMethod"],
  watch:{
    show(val){
      if (val == true) {
        this.$nextTick(() => {
          this.$refs.getpName.pName();
          this.$refs.getpPerson.pPerson();
          // this.$refs.getpAuthority.pAuthority();
          this.$refs.getmPerson.mPerson();
          this.$refs.getmAllocation.mAllocation();
          this.$refs.getpState.pState();
          this.$refs.getdz.dz();
        })
      }
    },
    value(val){
      this.pName = val;
      this.pPerson = val;
      this.mAllocation = val;
      this.mPerson = val;
      // this.pAuthority = val;
      this.pState = val;
      this.dz = val;
    },
    dialogFormVisible(newVal) {
      this.dialogFisible = newVal;
    },
    visible(newVal) {
      this.$emit('update:dialogFormVisible', newVal);
    },
  },
  data(){
    return{
      pName: '',
      pPerson: '',
      mAllocation: '',
      mPerson: '',
      pState:'',
      dz:'',
      // msgText:'',
      // showMessage: false,
      formLabelWidth: '150px',
      dialogFisible: this.dialogFormVisible,
      // dialogFormVisible: false,
    }
  },
  methods:{
    confirmClick() {
      if (this.pName == ""&&this.pPerson ==""&&this.mAllocation == ""&&this.mPerson ==""&&this.pState==""&&this.dz=="") {
        // this.msgText = "内容未填写";
        // this.showMessage = true;
      } else {
        this.$emit('confirm', this.pName);
        this.$emit('confirm', this.pPerson);
        this.$emit('confirm', this.mAllocation);
        this.$emit('confirm', this.mPerson);
        // this.$emit('confirm', this.pAuthority);
        this.$emit('confirm', this.pState);
        this.$emit('confirm', this.dz);
      }
    },
    cancelClick() {           
      this.fatherMethod();
    },
    getmkdz() {           

    },
  }
}
</script>

<style>
.el-input{
  width: 200px;
}
.el-dialog{
  width: 450px;
  height: 485px;
}
.el-form-item{
  margin-bottom: 10px;
}
.el-dialog__body {
    padding: 5px 0px;
}
</style>
